<template>
	<view>
		<cu-custom bgColor="bg-gradual-green" :isBack="true">
			<block slot="backText">返回</block>
			<block slot="content">添加预约</block>
		</cu-custom>

		<view style="display: flex;width: 100%;padding: 0 4%;justify-content: space-between;height: 100upx;line-height: 100upx;border-bottom: 1upx solid #F0F0F0;">
			<view class="">
				事件*
			</view>
			<view>
				<view class="uni-list">
					<view class="uni-list-cell">
						<view class="uni-list-cell-db">
							<picker @change="bindPickerChange" :value="index" :range="array">
								<view>
									<input style="height: 100upx;line-height: 100upx;text-align: right;" type="text" disabled :value="array[index]"
									 placeholder="请选择事件类型" />
								</view>
							</picker>
						</view>
					</view>
				</view>
			</view>
		</view>
		<view @click="jump" :data-src='"/pagesA/Physical_test/ChooseUser?id="+ userId' style="display: flex;width: 100%;padding: 0 4%;justify-content: space-between;height: 100upx;line-height: 100upx;border-bottom: 1upx solid #F0F0F0;">
			<view class="">
				选择客户*
			</view>
			<view style="display: flex;">
				<view style="width: 70upx;height: 70upx;line-height: 70upx;border-radius: 35upx;background-color: #1CBBB4;color: #fff;text-align: center;margin-top: 15upx;font-size: 22upx;">
					{{phyUser.username}}
				</view>
				<view style="height: 100upx;line-height: 100upx;margin-left: 30upx;">
					{{phyUser.username}}
				</view>
			</view>
		</view>
		<view style="display: flex;width: 100%;padding: 0 4%;justify-content: space-between;height: 100upx;line-height: 100upx;border-bottom: 1upx solid #F0F0F0;">
			<view class="">
				开始时间
			</view>
			<view style="display: flex;">
				<picker mode="date" :value="date" :start="startDate" :end="endDate" @change="bindDateChange">
					<view>
						<input style="height: 100upx;line-height: 100upx;text-align: right;" type="text" disabled :value="date"
						 placeholder="请选择开始日期" />
					</view>
				</picker>
				<picker mode="time" :value="time" start="09:01" end="21:01" @change="bindTimeChange">
					<view>
						<input style="height: 100upx;line-height: 100upx;text-align: right;width: 100upx;" type="text" disabled :value="time"
						 placeholder="请选择开始时间" />
					</view>
				</picker>
			</view>
		</view>
		<view style="display: flex;width: 100%;padding: 0 4%;justify-content: space-between;height: 100upx;line-height: 100upx;border-bottom: 1upx solid #F0F0F0;">
			<view class="">
				结束时间
			</view>
			<view style="display: flex;">
				<picker mode="date" :value="date" :start="startDate" :end="endDate" @change="bindDateChange">
					<view>
						<input style="height: 100upx;line-height: 100upx;text-align: right;" type="text" disabled :value="date1"
						 placeholder="请选择结束日期" />
					</view>
				</picker>
				<picker mode="time" :value="time" start="09:01" end="21:01" @change="bindTimeChange">
					<view>
						<input style="height: 100upx;line-height: 100upx;text-align: right;width: 100upx;" type="text" disabled :value="time1"
						 placeholder="时间" />
					</view>
				</picker>
			</view>
		</view>
		<view style="width: 100%;padding: 0 4%;">
			<view style="height: 100upx;line-height: 100upx;">
				备注
			</view>
			<view>
				<textarea value="" placeholder="请输入备注" style="background-color: #F6F6F6;width: 100%;border-radius: 15upx;line-height: 30upx;padding: 10upx 20upx;" />
				</view>
		</view>
		
		<button @click="submit" type="default" style="width: 100%;background-color: #39BB9E;color: #FFFFFF;position: fixed;bottom: 0upx;border-radius: 0;">保存</button>
</view>
</template>

<script>
	let baseUrl = uni.getStorageSync("baseUrl");
	function getDate(type) {
		const date = new Date();
	
		let year = date.getFullYear();
		let month = date.getMonth() + 1;
		let day = date.getDate();
		let Minutes = date.getMinutes();
		let Seconds = date.getSeconds();
	
		if (type === 'start') {
			year = year - 60;
		} else if (type === 'end') {
			year = year + 2;
		}
		month = month > 9 ? month : '0' + month;;
		day = day > 9 ? day : '0' + day;
	
		return `${year}-${month}-${day}`;
	}
	export default {
	    data() {
	        return {
							userId: uni.getStorageSync("userId"),
							phyUser: JSON.parse(uni.getStorageSync("phyUser")),
	            title: 'picker',
							coach:'',
	            index: '',
							date1:'',
							time1:'',
	            date: getDate({
	            	format: true
	            }),
							startDate:getDate('start'),
							endDate:getDate('end'),
							time: '12:01'
	        }
	    },
	    methods: {
					submit(){
						var data = {
								id : this.id,//客户id
								curriculum: this.curriculum,//课程
								period: this.period,//课时
								unitPrice: this.unitPrice,//课单价
								date: this.date1,//有效期
								remarks: this.remarks,//备注
								coach : this.coach,//教练
							}
							console.log(data)
							uni.request({
								url: baseUrl + '/coach/members/addQuestionnaireSurvey',
								method: 'POST',
								data: data,
								header:{'Content-Type':'application/x-www-form-urlencoded'},
								success: res => {
									console.log('查看提交数据', res);
								},
								fail: () => {},
								complete: () => {}
							});
					},
	        bindPickerChange: function(e) {
	            this.index = e.target.value
							console.log(this.array[this.index])
	        },
					bindTimeChange: function(e) {
						this.time = e.detail.value
						this.time1 = this.time
					},
	        bindDateChange: function(e) {
						console.log('picker发送选择改变，携带值为', e.target.value)
	        	this.date = e.detail.value
						this.date1 = this.date
	        },
					jump(e){
						console.log(e.currentTarget.dataset.src)
						if ( e.currentTarget.dataset.src == 'Not-yet-open') {
							uni.showModal({
								title:'提示',
								content:'功能即将开放',
								showCancel: false,
								confirmColor:"#DD524D",
									success() {
										return
									}
							})
						} else {
							uni.navigateTo({
								url: e.currentTarget.dataset.src
							});
						}
					},
	    }
	}
</script>

<style>
	page {background-color: #fff;}
</style>
